<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        .box{
            width: 100%;
            height: 500px;
            background-color: #cccaca;

        }
        .left{
            width: 300px;
            height: 100%;
            margin-left: 80px;
            float: left;
            background-image: url("./img/phone.png");
            background-size: 100% 100%;
            background-repeat: no-repeat;
        }
        .right{
            width: 300px;
            height: 100%;
            background-image: url("./img/watch.png");
            background-size: 100% 100%;
            margin-right: 80px;
            float: right;
        }
        .center{
            width: 300px;
            height: 100%;
           background-image: url("./img/无线蓝牙耳机.png");
            background-size: 100% 100%;
            margin-left: 100px;
            float: left;
        }
        h1{
            text-align: center;
            background-color: #ffffff;
            margin-top: 300px;
        }
        p{
            text-align: left;
            background-color: #b13e3e;
            display: inline-block;
            width: 300px;
        }
        span{
            display: inline-block;
            width: 300px;
            height: 40px;
            color: #d64343;
        }
    </style>
</head>
<body>
 <div class="box">
  <div class="left">
  <h1>高端智能机</h1>
      <p>最新⼀代旗舰⼿机，配备超视⽹膜显示屏和专业级摄像</p>
      <span>￥6999</span>
  </div>
  <div class="center">
   <h1>无线蓝牙耳机</h1>
      <p>主动降噪技术，⾼保真⾳质，⻓达30⼩时续航时间</p>
      <span>￥1299</span>
  </div>

  <div class="right">
   <h1>智能手表</h1>
      <p>健康监测、运动追踪、通知提醒，你的随身健康</p>
      <span>￥2499</span>
  </div>
 </div>
</body>
</html>